MyModules.define('collapse',[],function(){

	class Child extends WidgetObject {
	    constructor() {
	        super(); // 调用父类构造函数
	        // 子类可以添加自己的属性或方法
	        this.name = '折叠顯示';
	        this.flag_button = true;
		    this.datas = {
				//控件属性
				id:"",
				name: "折叠顯示",
				type: "collapse",
				value:{ 
					content:{},
					class:'',
					class_id:'',
					style:''
				},
			};
			this.getHtml = function(){
	            var str = '';
	            var id = this.datas.id;
	            var title = this.datas.value['title'] ? this.datas.value['title']  : '';
	            var content = this.datas.value['options'] ? this.datas.value['options'] : '';
	            str = `
	            <div class="panel-group wrap-widget" id="accordion" role="tablist" aria-multiselectable="true" data-id="${id}">
	            <div class="panel panel-default">
	                <div class="panel-heading" role="tab" id="headingOne">
	                <h4 class="panel-title">
	                    <a role="button" data-toggle="collapse" aria-expanded="true" aria-controls="collapseOne-${id}" class="btn btn-primary">
	                    ${title}
	                    </a>
	                </h4>
	                </div>
	                <div id="collapseOne-${id}" class="panel-collapse collapse" role="tabpanel" aria-labelledby="headingOne">
	                <div class="panel-body">
	                ${content}
	                </div>
	                </div>
	            </div>
	            </div>
	            `;
				return str;
	        };
	        this.inputTemplate = function(id, value){
	        	var title='',content='';
	            if( typeof(value)!="undefined" ){
	                title = value['title'] ? value['title'] : '';
	                content = value['options'] ? value['options'] : '';
	            }
	            
	            var shtml = `
	                <div class="form-group">
	                <label>標題</label>
	                <input type="text" name="title" value="${title}" class="form-control"/>
	                </div>
	                <div class="form-group">
	                <label>內容</label>
	                <textArea placeholder="內容" name="options" class="form-control editorWidget" id="editorWidget_${id}">${content}</textArea>
	                </div>
	            `;
	            return shtml;
	        };
	        this.saveData = function(){
	        	var content = my_editor.getData('editorWidget_'+this.datas.id);

				$('textarea.editorWidget').val(content);

				var values = $("#myModal form").serializeArray();
				
				this.datas.value = arrayToObject(values);
	        };
	        this.registerJs = function(){
	            my_editor.show('editorWidget_'+this.datas.id, 'textarea.editorWidget');
	        }
	    }
	}
	return new Child();
    
});
